@import 'com/sass/_utils-wap';
@import 'com/sass/_reset-wap';
@import 'compass/css3';
$icon:sprite-map("stu/read/*.png",$spacing:10px);
body{
    color: #333;
}
a{
    color: #555;
}
a:hover{
    text-decoration: none;
}
header{
    font-size: 34px/$ppr;
    border-bottom: #dcdcdc solid 1px;
    height: 95px/$ppr;
    line-height: 95px/$ppr;
    text-align: center;
    position: relative;
    color: #ff6611;
    #back{  
        @include icon($icon,"back");
        display: inline-block;
        position: absolute;
        left: 35px/$ppr;
        top: 30px/$ppr;
    }
}
.title{
    height: 95px/$ppr;
    line-height: 95px/$ppr;
    border-bottom: #dbdbdb solid 1px;
    font-size: 32px/$ppr;
    color: #333;
    text-align: center;
    li{
        width: 50%;
        float: left;
        a{
            display: block;
        }
        &.on{
            a{
                line-height: 93px/$ppr;
                border-bottom: #ff6611 solid 2px/$ppr;
                color: #ff6611;
            }
        }
    }
}
.list{
    li{
        border-bottom: #dcdcdc solid 1px;
        line-height: 95px/$ppr;
        padding: 0 30px/$ppr;
        font-size: 28px/$ppr;
        color: #555;
        position: relative;
        text-indent: 70px/$ppr;
        i{
            color: #999;
            margin-left: 10px/$ppr;
        }
        em{
            @include icon($icon,'read_04');
            display: block;
            position: absolute;
            top: 20px/$ppr;
        }
        span{
            float: right;
            position: relative;
            width: 160px/$ppr;
            a{
                
                &:first-child{
                    @include icon($icon,"read_06");
                    left: 0;
                    top: 30px/$ppr;
                    position: absolute;
                }
                &:nth-child(2){
                    @include icon($icon,"read_08");
                    top: 30px/$ppr;
                    position: absolute;
                    left: 50px/$ppr;
                }
                &:nth-child(3){
                    @include icon($icon,"read_10");
                    top: 30px/$ppr;
                    position: absolute;
                    left: 100px/$ppr;
                }
            }
            b{
                float: right;
                font-size: 28px/$ppr;
                color: #999;
                font-weight: normal;
            }
        }
    }
}
.tip{
    width: 670px/$ppr;
    height: 210px/$ppr;
    background: #fcf7e3;
    border: #ffbb00 5px/$ppr solid;
    border-radius: 110px/$ppr;
    position: fixed;
    left: 20px/$ppr;
    bottom: 50px/$ppr;
    p{
        font-size: 28px/$ppr;
        color: #333;
        line-height: 58px/$ppr;
        position: absolute;
        top: 50px/$ppr;
        left: 50px/$ppr;
        input{
            border:none;
            border-bottom: #333 solid 1px;
            width: 80px/$ppr;
            color: #ff6611;
            text-align: center;
        }
    }
    i{
        @include icon($icon,'tip_09');
        position: absolute;
        top: 70px/$ppr;
        left: 290px/$ppr;
        &.r{
            @include icon($icon,'tip_13');
        }

    }
    span{
        @include icon($icon,'tip_03');
        position: absolute;
        bottom: 25px/$ppr;
        right: 50px/$ppr;
        &.w{
            @include icon($icon,'tip_05');
        }
        &.r{
            @include icon($icon,'tip_04');
        }
    }
    em{
        @include icon($icon,'tip_06');
        position: absolute;
        bottom: 45px/$ppr;
        right: 5px/$ppr;
    }
}